@charset "utf-8";

@import 'cm-scss';

header{
    height: halfRatio(90);
    box-sizing: border-box;
    padding: halfRatio(20) halfRatio(22) halfRatio(10);
        .back-css{
           
            width: halfRatio(123);
            border: 1px solid $theme-color;
            border-radius: 15px;
            vertical-align: baseline;
            a{
                display: block;
                text-align: center;
                font-size: halfRatio(26);
                
            }
        }
        .title-css{
        
            margin: 0 auto;
            text-align: center;
            font-size: halfRatio(26);
           vertical-align: baseline;
            
            
        }
        .ic-css{
            width: halfRatio(52);
            vertical-align: baseline;
           
            img{
                width: 100%;
                vertical-align: top;
            }
        }
        
        
        
}


section{
    top: halfRatio(90);
    box-sizing: border-box;
    padding: 0 halfRatio(22);
    
    .swiper-slide{
        width:100%;
        height: toRem(260);
        
        .slide-img:nth-of-type(1){
            width: 100%;
            height: 100%;
            background-image: url(../img/detail/banner.png);
            background-repeat: no-repeat;
            background-size: auto 100%;
            background-position: center center;
        }

    }
    
    .goods-des{
        .des-line{
            
            line-height: toRem(72);
            margin: halfRatio(25) 0;
            .g-price{
                display: inline-block;
                vertical-align: middle;
                color: $theme-color;
                font-size: toRem(72);
            }
            
            .g-buy{
                vertical-align: middle;
                display: inline-block;
                width: toRem(110);
                height: toRem(60);
                border: 1px solid $theme-color;
                border-radius: toRem(15);
                background-color: $theme-color;
                
                
                a{
                    font-size: toRem(30);
                    display: block;
                    color: white;
                    text-align: center;
                    height: toRem(60);
                    line-height: toRem(60);
                }
            }
            
            
            .g-praise{
                img{
                    width: toRem(38);
                    vertical-align: middle;
                }
                span{
                    vertical-align: middle;
                    font-size: toRem(30);
                }
                .percent{
                    color: $theme-color;
                }
                
                
            }
            .g-praisenum{
                
                a{
                    color: $des-color;
                    font-size: toRem(26);
                }
                
            }
        }
        
        
        
        
    }
    
    .recommend-list{
        
        .other-shop{
            box-sizing: border-box;
            padding: 0 halfRatio(10);
            line-height: toRem(68);
            background-color: $theme-color;
            color: white;
            .re-des{
                font-size: toRem(30);
                color: white;
            }
         
            .re-into{
                a{
                    color: white;
                }
                
                
            }
        }
        
        
        dd{
            .shop-info{
              margin: halfRatio(5) 0;
              width: 100%;  
              float: left;
              display: inline-block;
                /*  .cm-btn{
                      background-color: $theme-color;
                      border: 1px solid $theme-color;
                      border-radius: 15px;
                      width: toRem(110);
                      height: toRem(60);
                      text-align: center;
                      a{
                          line-height: toRem(60);
                          display: block;
                          width: 100%;
                          height: 100%;
                          font-size: toRem(30);
                          color: white;
                      }
                  }*/
                  
                  .shop-img{
                        float: left;   
                        width: toRem(212);
                        img{
                            width: 100%;    
                        }
                  }   
                  .shop-msg{
                      float: left;
                      width: toRem(360);
                      font-size: toRem(30);
                      margin: toRem(8) 0 toRem(8) toRem(20) ;
                      
                      &:nth-of-type(2){
                        img{
                            width: toRem(36);
                        }
                        span{
                         font-size: toRem(22);
                         color: $des-color;
                         vertical-align: text-top;
                        }
                      }
                      
                      &:nth-of-type(3){
                        font-size: toRem(22);
                        color: $des-color;
                      }
                      &:nth-of-type(4){
                        font-size: toRem(20);
                        a{
                            color: $theme-color;
                        }
                      }
                      
                  }
                  
                  
                  
                  
            }
            
        }
        
        
    }
       
    
        

    
            
            
    
    
}
